<template>
	<view>
		<view class="flex align-center padding-lr-xs padding-tb-sm">
			<image class="shop-logo " :src="shopStore.imgUrl" />
			<view class="padding-left-sm">
				<view class="flex align-center">
					<view >{{shopStore.name}}</view>
					<view class="cu-tag radius bg-red sm margin-left-sm">{{$t('shop-store-info.index.dk47ms')}}</view>
				</view>
				<view class=" align-center margin-top-xs text-gray">
					<view class="text-sm overflow-2 loc-info ">{{shopStore.address}}</view>
					<view class="text-sm ">{{shopStore.phone}}</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	import { getObj } from '@/api/mall/shopstore.js'
	export default {
		props: {
			storeId: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				shopStore: {
					imgUrl: ''
				}
			}
		},
		watch: {
			storeId: {
				handler(val) {
					this.shopStoreGet()
				},
				immediate: true
			}
		},
		methods: {
			shopStoreGet() {
				//门店地址
				if (this.storeId) {
					getObj(this.storeId).then(res => {
						this.shopStore = res.data;
					})
				}
			},
		}
	}
</script>
<style>
	.shop-logo{
		width: 108rpx;
		height: 108rpx;
	}
	
	.cu-tag.sm {
		font-size: 20upx;
		padding: 0upx 10upx;
		height: 40upx;
	}
</style>